@import  "../../base/fn";

.ui-table{
    width: 100%;
    border-collapse:collapse;
    th{
      font-weight: 500;
    }
    td,th{
      border-bottom: 1px solid $bordercolor;
      border-right: 1px solid $bordercolor;
      text-align: center;
    }
    tr{
      td:last-child,th:last-child{
        border-right: 0;
      }
      &:last-child td{
          border-bottom: 0;
      }
    }
}


@media screen and (-webkit-min-device-pixel-ratio: 2) {
  .ui-table{
    td,th{
      position: relative;
  		border-right: 0;
      border-bottom: 0;
    }
    td:after,th:after{
      content: "";
      position: absolute;
      width: 100%;
      height: 100%;
      left: 0;
      top:0;
      background-image: $border-r,$border-b;
      background-size: 1px 100% ,100% 1px;
      background-repeat: no-repeat;
      background-position: right, bottom;
      pointer-events: none;
    }
    tr{
      td:last-child:after,th:last-child:after{
        background-image: $border-b;
        background-size: 100% 1px;
        background-repeat: no-repeat;
        background-position: bottom;
      }
      &:last-child td:after{
          background-image: $border-r;
          background-size: 1px 100%;
          background-repeat: no-repeat;
          background-position: right;
      }
      &:last-child td:last-child:after{
          background-image: none;
      }
    }
  }
}
